<?php if (!defined('THINK_PATH')) exit();?><!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Search Data Detail</title>
    <link rel="stylesheet" href="/wlmdetail/Public/statics/layui/css/layui.css">
    <style type="text/css">
        html, body { margin: 0; padding: 0; }
        .top-title { text-align:center; margin-top:20px;}
    </style>
</head>
<body>
<div class="top-title">
    <h1>王凉面___发货状态查询</h1>
</div>
<div class="content-list">
    <div class="layui-inline">
        <form class="layui-form">
            <input class="layui-input layui-input-sm" name="search" id="search" required lay-verify="required" placeholder="姓名/联系方式" autocomplete="off">
        </form>
    </div>
    <button id="searchbtn" class="layui-btn layui-btn-sm layui-icon layui-icon-search" data-type="reload">搜索</button>
    <table id="container" lay-filter="edittable"></table>
</div>
</body>
<script src="/wlmdetail/Public/statics/layui/layui.js"></script>
<script type="text/javascript">
    layui.use(['laydate', 'table', 'layer', 'laypage', 'form'], () => {
        var table = layui.table;
        var laydate = layui.laydate;
        var layer = layui.layer;
        var form = layui.form;
        var laypage = layui.laypage;
        var $ = layui.jquery;
        var tableIns = table.render({
            text: { none: '暂无相关数据' },
            initSort: {field: 'id', type: 'desc'},
            elem: '#container',
            url: "<?php echo U('Home/Index/visitSearch');?>",
            height: 'full-200',
            cellMinWidth: 50,
            loading: true,
            size: 'sm',
            cols: [[
                {field: 'id', title: 'No .', sort: true, hide: true},
                {field: 'name', title: '姓名'},
                {field: 'area', title: '地区'},
                {field: 'status', title: '发货状态', templet: (data) => { return data.status == '已发货' ? "<span style='color:orangered;'>"+ data.status +"</span>" : "<span style='color:#5FB878;'>"+ data.status +"</span>"}},
                {field: 'deliveryDate', title: '发货日期'},
                {field: 'currentTime', title: '登记时间'},
            ]]
        })
        document.getElementById('searchbtn').onclick = () => {
            var value = document.getElementById("search").value;
            if (value == '') {
                layer.msg("请输入要搜索的信息", {icon: 16});
                tableIns.reload({
                    where: {search: null}
                });
                layer.close(layer.index);
            }
            if (value != '') {
                layer.msg('数据请求中...', {icon: 16});
                tableIns.reload({
                    page: {curr: 1},
                    where: {search: value},
                });
                layer.close(layer.index);
                document.getElementById('search').value = '';
            }
        }
    })
</script>
</html>